/*标签选择器*/
h1{
    color: #3c763d;
}
/*整个页面的strong都是红色风格*/
strong {
    color: red;
}
input {
    background-color: #31b0d5;
}
/*标签选择器高级语法，多个标签共同使用同一属性*/
h1, h2 {
    color: #e4c652;
    font-size: 20px;
}

/*派生选择器，通过标签的层级选择进行选择*/
/*但是我想让某个div下面的是绿色*/
div  strong {
    color: #3c763d;
}
.divClass .spanClass{
    color: #a94442;
}

/*id选择器*/
#span{
    width: 30px;
    height: 10px;
    font-size: 20px;
    padding-top: 10px;
    background-color: #9c6b3c;
}
/*类选择器*/
.myClass{
    color: #a94442;
    margin-right: 40%;
    margin-left: 50%;
}
/*继承，如果有多个标签样式指定到同一个元素的时候，不同的属性会进行合并显示到指定的元素上面*/
/*在相同选择器的情况下并且选择了同一个标签进行样式设置，代码执行顺序是由上至下执行*/
/*比如下面的:都是标签选择器，那么执行顺序由上至下执行，
当这两个选择器没有属性冲突的时候，那么两个选择器的属性都会在标签身上生效*/
/*如果有属性冲突的时候，默认使用下面的那一个属性作为标签的样式，
也就是说下面的会把上面的样式属性覆盖掉*/
h3{
    color: #3c763d;
    font-size: 30px;
}
h3{
    background-color: #31b0d5;
    color: #a94442;
}
table{
    width: 300px;
}
table td{
    text-align: center;
}
table,th,td{
    border: 2px solid grey;
}
.position{
    top:50%;
    /*left: 45%;*/
    right: 50%;
    position:absolute;
}